<script src="<?php echo base_url(); ?>js/holder.js"></script>
<div class="row">
    <div class="col-xs-12 col-md-3">
        <div class="thumbnail">
            <a href="<?php echo base_url('category/details/1'); ?>">
                <img data-src="holder.js/100%x180/#000:#fff" alt="...">
            </a>
            <div class="caption">
                <h3>Sour</h3>
                <p>Here you will find mouthwatering and tooth destroying drinks.</p>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-md-3">
        <div class="thumbnail">
            <a href="#">
                <img data-src="holder.js/100%x180/#000:#fff" alt="...">
            </a>
            <div class="caption">
                <h3>Sweet</h3>
                <p>Sweet and delicious liquids are offered in this category.</p>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-md-3">
        <div class="thumbnail">
            <a href="#">
                <img data-src="holder.js/100%x180/#000:#fff" alt="...">
            </a>
            <div class="caption">
                <h3>Tropical</h3>
                <p>Ever wondered what it would taste like to lick a ranbow?</p>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-md-3">
        <div class="thumbnail">
            <a href="#">
                <img data-src="holder.js/100%x180/#000:#fff" alt="...">
            </a>
            <div class="caption">
                <h3>Hardliner</h3>
                <p>Typically contains a lot of alcohol.</p>
            </div>
        </div>
    </div>
</div>